<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>禄鼎记</title>
    <script src="lib/pace.js"></script>
    <script>
        Pace.on("done", function(){
            $(".miStar").addClass('show');
        });
    </script>
    <style>
        body{width:720px;margin: 0 auto;}
    </style>
    <!--移动端版本兼容 -->
    <script type="text/javascript">
        (function(win) {
            var psWidth = 720;
            var screenWidth =  parseInt(window.screen.width),
                    screenHeight =  parseInt(window.screen.height);
            var phoneScale = screenWidth/psWidth;
            var ua = navigator.userAgent;
            if (/Android (\d+\.\d+)/.test(ua)){
                var version = parseFloat(RegExp.$1);
                if(version>2.3){
                    document.write('<meta name="viewport" content="width='+psWidth/2+', minimum-scale = '+phoneScale+', maximum-scale = '+phoneScale+', target-densitydpi=device-dpi">');
                }else{
                    document.write('<meta name="viewport" content="width='+psWidth/2+', target-densitydpi=device-dpi">');
                }
                // 其他系统
            } else {
                document.write('<meta name="viewport" content="width='+psWidth/2+', user-scalable=no, target-densitydpi=device-dpi">');
            };
            var doc = win.document;
            var docEl = doc.documentElement;
            var tid;
            function refreshRem() {
                var width = docEl.getBoundingClientRect().width,
                        height = docEl.getBoundingClientRect().height;
                if (width > psWidth) { // 最大宽度
                    width = psWidth;
                }
                var rem = width / 10; // 将屏幕宽度分成10份， 1份为1rem
                docEl.style.fontSize = rem + 'px';
                var isMobile = /AppleWebKit.*Mobile/i.test(navigator.userAgent) || (/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amoi|ZTE/.test(navigator.userAgent));
                if(screenWidth/screenHeight>320/500 && isMobile){
                    docEl.style.fontSize = psWidth/20*(320/500)/(screenWidth/screenHeight)+'px';
                }
            }
            win.addEventListener('resize', function() {
                clearTimeout(tid);
                tid = setTimeout(refreshRem, 300);
            }, false);
            win.addEventListener('pageshow', function(e) {
                if (e.persisted) {
                    clearTimeout(tid);
                    tid = setTimeout(refreshRem, 300);
                }
            }, false);
            refreshRem();
        })(window);
    </script>
    <!--移动端版本兼容 end -->

    <link rel="stylesheet" type="text/css" href="css/index.css">
</head>
<body class="miStar">

    <div class="giftTip"></div>

    <div class="giftBox">
        <div class="box"></div>
        <!--<div class="disk">-->
            <!--<div class="foodInside">-->
                <!--<img src="asset/insideFood.png">-->
            <!--</div>-->
        <!--</div>-->
        <!--<div class="diskFoodDone">-->
            <!--&lt;!&ndash;<img src="asset/foodDone.png">&ndash;&gt;-->
        <!--</div>-->


    </div>
    <div class="commonDiv opeDyBoxDiv">
        <div class="dyBox"></div>
    </div>
    <div class="commonDiv opeBoxDiv">
        <div class="openBox"></div>
    </div>
    <div class="commonDiv opeDiskDiv">
        <div class="disk">
            <div class="foodInside">
                <img src="asset/insideFood.png" style="width: 100%;">
            </div>
        </div>
    </div>
    <div class="commonDiv opeDiskFoodDone">
        <div class="diskFoodDone">
            <!--<img src="asset/foodDone.png">-->
        </div>
    </div>
    <div class="commonDiv opeMoneyKing" style="z-index: 1">
        <div class="moneyKing">
            <a href="https://m.mazing.com/open/show/back">
                <div class="bigTitle">
                    <img src="asset/bigTitle.png" style="width: 100%">
                </div>
                <div class="title">
                    <img src="asset/title.png" style="width: 100%">
                </div>
                <img src="asset/moneyKing.png"style="width: 50%">
            </a>
        </div>
    </div>
    <div class="food">
        <div class="hand">
            <img src="asset/hand.png" style="width: 100%"/>
        </div>
        <div class="handTrack4">
            <img src="asset/flash4.png" style="width: 100%"/>
        </div>
        <div class="copyhandTrack4 handTrackShow">
            <img src="asset/flash4.png"  style="width: 100%"/>
        </div>
        <div class="handTrack3 handTrackShow">
            <img src="asset/flash3.png"  style="width: 100%"/>
        </div>
        <div class="handTrack2 handTrackShow">
            <img src="asset/flash2.png" style="width: 100%"/>
        </div>
        <div class="handTrack1 handTrackShow">
            <img src="asset/flash1.png" style="width: 100%"/>
        </div>
        <div class="handTrack5 handTrackShow">
            <img src="asset/flash1.png" style="width: 100%"/>
        </div>
    </div>
    <!--<div class="box"></div>-->
    <div class="hat">
        <img src="asset/hat.png" style="width: 100%"/>
    </div>

    <div class="foodCut">
        <img src="asset/foodCut.png" style="width: 80%"/>
    </div>
    <div class="flashBg">
    </div>
    <div class="flashNBg">
    </div>
    <div class="logo">
        <img src="asset/nameLogo.png" style="width: 70%"/>
    </div>
    <div class="mainLogo">
        <img src="asset/logo.png" style="width: 50%"/>
        <div class="coupon">
            <img src="asset/coupon.png" style="width: 65%"/>
        </div>
    </div>

    <div class="wave">

    </div>
    <div class="cloud">

    </div>
    <!--<div class="flashCut">-->

    <!--<div class="foodTip"></div>-->
    <script src="lib/zepto.min.js"></script>
    <script src="js/index.js"></script>
</body>
</html>